<template>
    <div>
        <div>
            <div style="float:left">
                <Input style="width:250px" v-model="insName">
                <span slot="prepend">学院名称：</span>
                <Button slot="append" icon="ios-search" @click='findByInsName'></Button>
                </Input>
            </div>
            <Button-group style="visibility:hidden">
                <Button>将应用添加到学院</Button>
            </Button-group>
    
        </div>
    
        <Table border :columns="header" :data="data_list" size="small" ref="table" class="table" @on-row-click="rowClick" height="600"></Table>
    
        <Modal v-model="modal_temp_add_status" title="添加应用" @on-cancel="modal_cancel" @on-ok="option_add_app_save" width="700">
            <TempAddTable :appId="appId" ref="TempAddTable" @getSelectValue="getSelectValue"></TempAddTable>
        </Modal>
    
    </div>
</template>
<script>

import TempAddTable from './TempAddTable'

export default {
    components: {
        TempAddTable
    },

    data() {
        return {

            //初始化url
            init_url: '/mes/core/app/real/get/list',
            temp_add_url: '/mes/core/smsTemp/real/temp/add',

            //表格标题
            header: [
                {
                    type: 'index',
                    width: 60,
                    align: 'center'
                },
                {
                    "title": "学院名称",
                    "key": "insName",
                    "width": 120,
                    "sortable": true,
                    render: (h, params) => {
                        return h('div', {
                        }, params.row.instituteEntity.name)
                    }
                },
                {
                    "title": "应用名称",
                    "key": "appName",
                    "min-width": 120,
                    "sortable": true,
                    render: (h, params) => {
                        return h('div', {
                        }, params.row.baseApplicationEntity.name)
                    }
                },
                {
                    "title": '操作',
                    "width": 150,
                    "align": 'center',
                    render: (h, params) => {
                        return h('div', [
                            h('Button', {
                                props: {
                                    type: 'primary',
                                    size: 'small'
                                },
                                style: {
                                    marginRight: '5px'
                                },
                                on: {
                                    click: () => {
                                        this.add_show(params)
                                    }
                                }
                            }, '添加模板'),

                        ]);
                    }
                }

            ],
            ruleValidate: {
                name: [
                    { required: true, message: '姓名不能为空', trigger: 'blur' }
                ],
            },
            //表格数据源
            data_list: [],
            //表格数据源缓存
            data_cache_list: [],
            //选中的数据的应用id集合
            data_select_list: [],
            //查询的名称
            insName: '',
            //modal状态
            modal_temp_add_status: false,
            //选中的应用id
            appId: '',
            //需要添加到应用的签名id
            selectTempId: [],
        }
    },
    methods: {
        //到处excel
        exportData(type) {
            if (type === 1) {
                this.$refs.table.exportCsv({
                    filename: '原始数据'
                });
            } else if (type === 2) {
                this.$refs.table.exportCsv({
                    filename: '排序和过滤后的数据',
                    original: false
                });
            }
        },
        rowClick(row) {
            this.$emit('getAppId', row.id);
        },

        //根据学院名称查询学院
        findByInsName() {
            this.insName = this.$stringUtil.stringTrim(this.insName);
            var name = this.insName;

            if (name == "") {
                this.data_list = this.data_cache_list.slice();
                return;
            }
            console.log(this.data_cache_list);
            var match = this.$stringUtil.stringMatch;
            this.data_list = $.grep(this.data_cache_list, function (value) {
                if (match(value.instituteEntity.name, name)) {
                    return value;
                }
            });
        },
        //modal对话框取消事件
        modal_cancel() {
            this.$Message.info('操作已经取消');
        },
        add_show(params) {
            this.modal_temp_add_status = true;
            this.appId = params.row.id;
            this.$refs.TempAddTable.appinit(this.appId);
        },
        getSelectValue(value) {
            this.selectTempId = value;
        },
        option_add_app_save() {
            var _self = this;
            if (this.selectTempId.length > 0) {

                this.$ajax.post(_self.temp_add_url, {
                    tempIdList: _self.selectTempId,
                    appId: _self.appId
                })
                    .then(function (response) {
                        if (response.data.status == "success") {
                            _self.$Message.info("短信模板添加成功");
                            _self.$emit('initRight');
                        } else {
                            _self.$Message.info("短信模板添加失败");
                        }
                    })
                    .catch(function (error) {
                        _self.$Message.info("短信模板添加失败");
                    })
            } else {
                this.$Message.info('短信模板添加失败');
            }
            _self.selectTempId = [];
        },

    },
    mounted() {

        var _self = this;

        //初始化表单数据
        this.$ajax.get(_self.init_url)
            .then(function (response) {
                if (response.data.status == "success") {
                    _self.data_list = response.data.data;
                    _self.data_cache_list = _self.data_list.slice();
                }

            })
            .catch(function (error) {
                console.log(error);
            });
    },

}
</script>

<style>
.btn-group {
    margin-bottom: 5px;
}
</style>
